<template>
  <div>
    <el-form>
      <el-form-item label="一级分类">
        <el-select v-model="first_type_id" placeholder="添加一级分类">
          <el-option
            v-for="(type, i) of firstcategory"
            :key="i"
            :label="type.name"
            :value="type.id"
          ></el-option>
        </el-select>
        <el-form-item label="添加品牌">
          <el-input v-model="second_type_name"></el-input>
        </el-form-item>
      </el-form-item>
        <el-button type="success" @click="addsecond">成功按钮</el-button>
    </el-form>
  </div>
</template>
<script>
export default {
  data() {
    return {
      first_type_id: "",
      firstcategory: [],
      second_type_name: "",
      second_type_id: "001",
    };
  },
  methods: {
    // 添加二级类目
    addsecond() {
      this.$axios.get("/products/addsecondt",{
        params:{
          id:`${this.first_type_id}${this.second_type_id}`,
          first_type_id:this.first_type_id,
          name:this.second_type_name
        }
      }).then((res) => {
        if (res.data.code == "200") {
          this.second_type_id++;
          alert("添加成功");
        }
      });
    },
  },
  mounted() {
    // 获取类别表  一级 && 二级
    this.$axios.get("/products/firstcategory").then((res) => {
      var { results } = res.data;
      if (res.data.code == "200") {
        this.firstcategory = results;
      }
    });
  },
  watch: {
    // 当一级类目发生改变时，二级类目的id重新变为1000
    first_type_id() {
      console.log(this.first_type_id);
      this.second_type_id = 001;
    },
  },
};
</script>